{{template "admin/public/head.html" .}}
<section>
	<aside>
		{{template "admin/public/nav.html" .}}
	</aside>
	<style type="text/css">
		.baseData{height: 30vh;}
	</style>
		<article>
			{{if eq .admin_gid "0"}}
			<div class="top-title">
				<dl>
					<dt><h1>{{.title}}</h1></dt>
					<dd>
						<select class="select" style="width: 70%;line-height: 20px;font-size: 14px;padding: 5px;border: none;">
							<option value="0">总部</option>
							{{range .shop}}
							<option value="{{.id}}" {{if $.shopid}}{{if eq .id $.shopid}}selected{{end}}{{end}}>{{.name}}</option>
							{{end}}
						</select>
					</dd>
				</dl>
			</div>
			{{end}}
			{{if .productCount}}
			<div class="content">
				<div class="statistics">
					<dl>
						<dt>会员总数</dt>
						<dd>总: {{.vipCount}}</dd>
					</dl>
					<dl>
						<dt>产品</dt>
						<dd>{{.productCount}}件</dd>
					</dl>
				</div>
			</div>
			{{end}}
			<!-- 统计 -->
			<div class="content baseData">
				
			</div>
			<!-- 统计图 -->
			<!-- <div class="content">统计图</div> -->
			<div class="content baseData">
				
			</div>
			<!-- 系统配置 -->
			<div class="content baseData">
				
			</div>
		</article>
	</section>

	<footer><!-- 系统监控内容 --></footer>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/admin/js/jquery.jedate.min.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/admin/js/toast.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/admin/js/uppic.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/admin/js/xcConfirm.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/admin/js/app.js"></script>
<script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/echarts-all.js?1"></script>
	<script>
		document.getElementsByClassName('select')[0].onchange = function (e) {
			var value = e.target.value
			location.search = 'shop=' + value
		}
		function buildChart(s){
	        var myChart = echarts.init(s.obj);
	        myChart.setOption(s.option);
        }
        buildChart({
        	obj:document.getElementsByClassName("baseData")[0],
        	option:{
			    title: {
			        text: '本周访客',
			        subtext: '我的店铺本周访客统计数据',
			        x: 'center'
			    },
			    xAxis: {
			        type: 'category',
			        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
			    },
			    yAxis: {
			        type: 'value'
			    },
			    series: [{
			        data: {{.rnum}},
			        type: 'line',
			        smooth: true
			    }]
			}
        })
        buildChart({
        	obj:document.getElementsByClassName("baseData")[1],
        	option:{
		    backgroundColor: '#fff',
			    title: {
			        text: '订单统计',
			        // subtext: '店铺热销产品排行',
			        left: 'left',
			        textStyle: {
			            color: '#666'
			        }
			    },

			    tooltip : {
			        trigger: 'item',
			        formatter: "{a} <br/>{b} : {c} ({d}%)"
			    },

		    xAxis: [{
				type: 'category',
				data: {{.ts}}
			}],
			yAxis: [{
		        type: 'value',
		        minInterval:1,
				interval:1,
				splitArea: {
					show: true
				}
		    }],
		    series : [
		        {
		            name:'订单统计',
		            type:'bar',
		            data:{{.onum}},
		            label: {
		                normal: {
		                    textStyle: {
		                        color: 'rgba(255, 255, 255, 0.3)'
		                    }
		                }
		            },
		            labelLine: {
		                normal: {
		                    lineStyle: {
		                        color: 'rgba(255, 255, 255, 0.3)'
		                    },
		                    smooth: 0.2,
		                    length: 10,
		                    length2: 20
		                }
		            },
		            itemStyle: {
		                normal: {
		                    color: '#c23531',
		                    shadowBlur: 200,
		                    shadowColor: 'rgba(0, 0, 0, 0.5)'
		                }
		            },
		        },
		         
		    ]
		}
        })
         buildChart({
        	obj:document.getElementsByClassName("baseData")[2],
        	option:{
		    backgroundColor: '#fff',
			    title: {
			        text: '销售额统计',
			        // subtext: '店铺热销产品排行',
			        left: 'left',
			        textStyle: {
			            color: '#666'
			        }
			    },

			    tooltip : {
			        trigger: 'item',
			        formatter: "{a} <br/>{b} : {c} ({d}%)"
			    },

		    xAxis: [{
				type: 'category',
				data: {{.ts}}
			}],
			yAxis: [{
		        type: 'value',
		        minInterval:1,
				interval:1,
				splitArea: {
					show: true
				}
		    }],
		    series : [
		        {
		            name:'订单统计',
		            type:'bar',
		            data:{{.mnum}},
		        },
		         
		    ]
		}
        })
	</script>
</body>
</html>
